<template>
  <div>
    <div class="contentDiv">
      <el-form :model="customUserInfoForm" :rules="rules" size='small' ref="customUserInfoForm" label-width="100px" class="demo-ruleForm">
          <el-divider  content-position="center"><span style="font-weight:bold;font-size:18px;" >卡特尔人十六项格测试</span></el-divider>
          <el-row style="padding-top:20px;">
            <el-col span="24">
              <el-form-item label="组织名称：" prop="orgName">
                <el-input v-model="customUserInfoForm.orgName" disabled placeholder=""></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col span="12">
              <el-form-item label="性 别：" prop="sex">
                <el-radio-group v-model="customUserInfoForm.sex">
                  <el-radio label="男"></el-radio>
                  <el-radio label="女"></el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col span="12">
              <el-form-item label="年 龄：" prop="age">
                <el-select v-model="customUserInfoForm.age" placeholder="请选择年龄">
                  <el-option v-for="index in 50" :key="index" :label="index+'岁'" :value="index"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col span="24">
              <el-form-item label="姓 名：" prop="realName">
                <el-input v-model="customUserInfoForm.realName"  placeholder=""></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col span="24">
              <el-form-item label="手机号：" prop="phone">
                <el-input v-model="customUserInfoForm.phone" maxlength="11"  placeholder=""></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col span="24">
              <el-form-item label="邮 箱：" prop="email">
                <el-input v-model="customUserInfoForm.email"  placeholder=""></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col span="24">
              <el-form-item label="密 码：" prop="password">
                <el-input v-model="customUserInfoForm.password" type="password" maxlength="18" placeholder="请输入查询密码"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col span="24">
              <el-form-item label="确认密码：" prop="rePassword">
                <el-input v-model="customUserInfoForm.rePassword"  type="password"  maxlength="18" placeholder="请输入再次输入查询密码"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item  style="text-align:center; padding-right:50px">
            <el-button type="primary" @click="submitForm">确定</el-button>
          </el-form-item>
      </el-form>
    </div>
    
    <div style="text-align: center; padding-bottom: 50px; font-size: 14px">
      由独领云科技 <span style="color: #666666">提供技术支持</span>
    </div>
  </div>
</template>

<script>
import {exportBizSixteenUserInfoExcel,saveOrUpdateBizSixteenUserInfo,saveOrUpdateBizSixteenUserInfoList,queryBizSixteenUserInfoByUserName,saveBizSixteenUserInfo,saveBizSixteenUserInfoList,deleteBizSixteenUserInfo,queryBizSixteenUserInfo,queryBizSixteenUserInfoListPage,updateBizSixteenUserInfo,deleteBizSixteenUserInfoList} from '@/api/biz/sixteen/bizSixteenUserInfoApi';
import { mapGetters } from 'vuex';
import { reqCommonMsg } from '@/util/reqCommonMsg';
import { regionData, CodeToText } from 'element-china-area-data';
import { getToken } from '@/util/auth';
import { Base64 } from 'js-base64';
export default {
 
  data() {
    return {
      tenantId: '',
      // 机构表单
      customUserInfoForm: {
        orgName: '独领云科技',
        sex: '男',
        age: '25',
        email: '330511@qq.com',
        phone: '17340088967',
        userName: '',
        realName: '测试用户',
        password: 'Li911993',
        rePassword: 'Li911993'
      },
      
      activeCode: {
        mobileNo: '',
        code: ''
      },
      rules: {
        orgName: [
          { required: true, message: '请输入组织名！', trigger: 'blur' }
        ],
        realName: [
          { required: true, message: '请输入姓名！', trigger: 'blur' }
        ],
        age: [
          { required: true, message: '请选择年龄！', trigger: 'blur' }
        ],
        sex: [
          { required: true, message: '请选择性别！', trigger: 'blur' }
        ],
        password: [
          { 
            // 检查密码
            validator: (rule, value, callback) => {
              //this.$console.log('this.$validate.checkPwdStrong(value)==',this.$validate.checkPwdStrong(value));
              if(!this.$validate.checkPwdStrong(value)){
                callback(new Error('密码强度须由大写字母、小写字母、数字、特殊字符 满足其中三种,长度大于等于6位'));
              }
              else{
                callback();
              }
            },
            required: true, 
            trigger: 'blur' 
          }
        ],
        rePassword: [
          { 
            // 二次校验密码
            validator: (rule, value, callback) => {
              if(value != this.customUserInfoForm.password){
                callback(new Error('两次输入的密码不一致，请重新输入！'));
              }
              else{
                callback();
              }
            },
            required: true, 
            trigger: 'blur' 
          }
        ],
        unifiedCreditDcode: [
          { required: true, message: '请输入营业执照统一信用代码', trigger: 'blur' }
        ],
        
        phone: [
          { 
            // 检查手机号
            validator: (rule, value, callback) => {
              if(!this.$validate.isMobile(value)){
                callback(new Error('请输入有效的手机号码！'));
              }
              else{
                callback();
              }
            },
            required: true, 
            trigger: 'blur' 
          }
        ],
        
        belongAreaDcode: [
          { required: true, message: '请选择企业所在区域', trigger: 'blur' }
        ],
        
        email: [
          { 
            validator: (rule, value, callback) => {
              if(!this.$validate.isEmail(value)){
                callback(new Error('请输入正确的邮件地址！'));
              }
              else{
                callback();
              }
            },
            required: true, 
            trigger: 'blur' 
          }
        ],
      },
     
      // 请求参数区
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      reqParams: {
        singleBody: {},
        listBody: [{}],
        sqlCondition: [],
        orderRule: [],
        currentPage: 1,
        pageSize: 10,
      },
      commonData: null,
      conditions: [],
      orderRules: [],
      singleBody: {},
    };
  },
  computed: {
    ...mapGetters([
      'website',
      'orgTree',
      'genOrgTree',
      'userInfo',
      'permission',
      'projectInfo',
    ]),
  },
  methods: {
    /**
     * 查询用户是否存在
     */
    submitForm(){
      let loading = this.$loading({
        lock: true,
        text: '正在生成题目...',
        spinner: 'el-icon-loading'
      });
      this.reqParams =  {
        singleBody: {
          userName: this.customUserInfoForm.phone
        },
        listBody: [{}],
        sqlCondition: this.conditions,
        orderRule: this.orderRules,
        currentPage: 1, 
        pageSize: 10
      }
      this.commonData = reqCommonMsg(this.reqParams)
      queryBizSixteenUserInfoByUserName(this.commonData).then(res => {
        let userDate = res.data.body.singleBody;      
        this.login();
        this.loading = false; 
      }, error => {
        //不存在则添加记录
        if((error+'').indexOf('E1010') > -1){
          this.saveUserInfo(loading);
        }
        else{
          this.loading = false; 
        }
      });
    },
    /**
     * 提交
     */
    saveUserInfo(loading) {
      this.$refs.customUserInfoForm.validate((valid) => {
        if (valid) {
          this.$console.log('数据验证通过！');   
          // 如果ID存在表示修改记录，否则新增记录
          this.reqParams.singleBody ={
            ...this.customUserInfoForm,
            userName: this.customUserInfoForm.phone,
            password: this.$toolUtil.encodeMd5(this.customUserInfoForm.password)
          }
          this.commonData = reqCommonMsg(this.reqParams)
          saveBizSixteenUserInfo(this.commonData).then(() => {
            loading.close();
            this.login();
          }, error => {
            loading.close();
            this.$console.log(error);
          });         
        }
        else{
          loading.close();
          this.$console.log('数据验证失败！');     
        }
      });
    },
    /**
     * 提交
     */
    login() {
      const loading = this.$loading({
        lock: true,
        text: '题目生成成功...',
        spinner: 'el-icon-loading'
      });
      this.reqParams = {
        username: this.tenantId+'=16pfCustom=password=pc=' + this.customUserInfoForm.phone+'@@password',
        // username: 'pwd='+this.tenantId+'='+this.loginForm.username+'=admin',
        //移动端登录 username: 'LEARN1001=custom=password=' + this.vx_provider + '=' + this.loginForm.userName,
        password: this.$toolUtil.encodeMd5(this.customUserInfoForm.password),
        tenantId: this.tenantId
      } 
          
      this.$store.dispatch('LoginByUsername', this.reqParams).then((data) => {
        console.log(' data.additionalInformation==', data.additionalInformation);
        localStorage.setItem('tenantId', data.additionalInformation.userInfo.tenantId);
        //跳转到成功提示页面
        setTimeout(() => {
          loading.close();
          this.$router.push({path: '/sixteen/questionSheet'});
        }, 1000);
      }).catch(() => {
        loading.close()
      });
    }
  },
  created() {
    let urlParam = this.$toolUtil.UrlSearch();
    //this.$console.log('DOOL1001==',Base64.encode('DOOL1001'));
    if (urlParam.cn) {
      this.customUserInfoForm.orgName = Base64.decode(urlParam.cn.replace(/%3D/g, '='));
    } else {
      alert('访问无效');
    }
    if (urlParam.tenantId) {
      this.tenantId = Base64.decode(urlParam.tenantId.replace(/%3D/g, '='));
      localStorage.setItem('tenantId', this.tenantId);
    } else {
      alert('访问无效');
    }
  }
};
</script>
<style  lang="scss">
html,
body,
#app {
  height: 100%;
  overflow: auto;
  margin: 0;
  padding: 0;
  background: #edf2f7 !important;
}
.contentDiv {
  margin: 0 auto;
  width: 500px;
  margin-bottom: 50px;
  margin-top: 100px;
  padding: 30px;
  background-color: #ffffff;
  border-radius: 5px;
  .el-input__inner{
    border-radius: 5px !important;
  }
  .el-upload--picture-card{
    height: 80px !important;
    width: 80px  !important;
    line-height:90px !important;
  }
  .el-icon-plus{
    font-size: 14px;
  }
  .el-form-item{
    margin: 5px !important;
  }
  .el-form-item__error{
    padding-top: 0px !important;
  }
  .el-form-item__label{
    padding-right: 0px !important;
  }
  
  .el-upload-list__item-thumbnail{
    width: 150px !important;
    height: 70px !important;
  }
  .avue-login .el-input{
    border-bottom: 0px solid #ffffff !important;
  }
}

</style>
